經歷了兩屆的鐵人賽，總算是把想要做卻積了很久的一些網頁教學，用錄的、寫的給製作出來了，這一些網頁教學基本上不單單是給所有人學習網頁的一份基礎入門指南，也是 Amos 上課輔助內容，原本是上課時才會跟學生說觀看影片的順序，但想想...為了讓影片能夠有更妥善的運用，那就把影片跟文章的閱讀方式與順序公開出來給大家好了，依照這樣的順序學習會是比較適合且順暢的，希望對大家有幫助。
基本上金魚都能懂的網頁教學系列可以給幾種不同的角色學習，每種角色大概如下
以下 Amos 就針對不同的角色建議一些學習的步驟，這樣能夠比較省下一些學習時間，也更加精確的可以把該角色必要學習的項目一次學完。
對於完全沒有學過網頁的新手來說，學習網頁的步驟就是一件很重要的事情了，Amos 針對新手學習網頁的順序會有六個步驟，按照順序排列如下
在第一階段必須要先了解 HTML 是什麼？並且學習基礎的 CSS 與 HTML 之間搭配使用的方式，所以在這階段會先讓新手先整個用最低程度的內容，把整個過程先進行一次。
有了前面的 HTML 與 CSS 基礎之後，為了讓我們撰寫版面更加的順暢，所以我們需要多學幾個 CSS 選取器的技巧跟觀念，把 CSS 選取器弄熟並理解，接著才可以讓我們製作網頁更加的順手。
有了前面兩個步驟的加持，這時候可以開始精進 Flex 原理以及切版實務的部份了，把 Flex 與切版實務做結合，好了解各式版面的切法。在切版的過程中可能會發現自己對於一些選取器不熟的地方，這時建議你隨時到 金魚都能懂的 CSS 選取器 看一下影片中使用到的選取器是怎麼使用的喔。
有了前面的切版練習的加持後，再來就是需要學習 RWD 網頁啦，第一步就是必須了解 RWD 網頁的基本原理，所以就可以繼續看金魚系列中 RWD 網頁的教學
太棒了! 如果你撐到了這一步，表示你真的非常有耐心，更是認真且用心! 如果你對前面的技術都開始有些熟悉度之後，我們再來就需要學習一些框架了，框架是目前業界經常會用到的一個工具，而 Bootstrap 更是其中數一數二多人使用的視覺框架，就讓我們來看看 Bootstrap 入門使用方式吧。
各位學習者~~來個歡呼聲!!! 恭喜你把一些基礎「快速」學習完了，接下來我們來加一點點的程式基礎吧，JQuery 應該是最容易讓新手入門的程式了，來學一點點的 JQuery 吧，看能夠幫我們的頁面添加甚麼樣有趣的效果吧。
恭喜你完成了最基本的新手入門教學流程啦，不要忘了來 金魚的意義由你訂 這邊留下你的感想與心得，接下來就能進入下一個階段了，但進入下一個階段之前，請確保你上面每一個教學都能熟練且理解，這樣才是真正的學會喔。不然就來報名 Amos 的暴力網頁入門班吧! 保證讓你醍醐灌頂學到不要不要的!
等有空再規劃...
等有空再規劃...
等有空再規劃...
等有空再規劃...
iThome鐵人賽
看影片追技術